This project is a simplified e-commerce interface that allows users to interact with a product list by adding items to a cart, adjusting quantities, removing products, and confirming orders. Though built without a backend, it simulates core online shopping functionalities using client-side state and local storage for data persistence.
The goal was to mimic essential e-commerce interactions while managing all state and data within the browser. The key challenge was handling cart updates in a way that felt responsive and realistic—without relying on server-side logic or database calls. Ensuring persistence across page refreshes was also crucial to emulate a user-friendly shopping experience.
I built the interface using React, TypeScript, and Tailwind CSS, leveraging localStorage to persist cart data across sessions. The project includes: Dynamic product display and interaction, Real-time cart updates including quantity increase/decrease and item removal, Order confirmation logic to simulate a checkout experience, and State synchronization with localStorage to ensure user data is retained even after reload.
The result is a lightweight, intuitive product listing and cart system that demonstrates foundational e-commerce functionality using only frontend technologies. This project strengthened my understanding of state persistence, array manipulation, and UI feedback loops, while also highlighting the power of localStorage in client-side development.
